<template>
  <div class="privilege" :class="classN">
    <img v-if="msg.imgUrl" class="width-40 height-46" :src="msg.imgUrl" alt="" mode="aspectFit">
    <div class="align-l mar-l-14">
      <div class="mar-b-10">{{msg.title}}</div>
      <div>{{msg.content}}</div>
    </div>
  </div>
</template>
<script>
export default {
  props: {
    info: {
      type: Object,
      default: function() {
        return {
          imgUrl: '',
          title: '',
          content: ''
        }
      }
    }
  },
  data() {
    return {}
  },
  computed: {
    msg() {
      return this.$utils.deepClone(this.info)
    }
  }
}
</script>
<style lang="less" scoped>
.privilege{
  display: flex;
  align-items: center;
  justify-content: flex-start;
  line-height: 1;
  height: 78px;
  background: white;
  box-shadow: 0 0 4px rgba(217, 177, 37, 0.36);
  border-radius: 10px;
  padding: 0 17px;
}
</style>
